{
	template:`
    <m-page @back="back" :title="title">
        <m-top></m-top>
        <m-title>{{title}}
			<template #action>
				<m-button @click="openDetail({status:'Y',level:{},operable:true})">新增</m-button>
			</template>
        </m-title>
		<m-top></m-top>
		<m-list ref="list" :url="url" :params="params" :bottom="0" :search="search">
			<template #item="{item}">
				<m-card join>
					<div class="flex padding-sm align-center" @click="openDetail(item)">
                        <div class="cu-tag radius" :class="'bg-'+item.level.color">{{item.level.name}}</div>
						<div class="flex-sub padding-lr-sm">
						    <div>
                                <span>{{item.realName}}</span>
                                <span class="text-sm text-gray padding-left-xs">{{item.phoneNum}}</span>
						    </div>
						    <div v-if="item.remark" class="padding-top-xs text-sm text-gray">{{item.remark}}</div>
						</div>
					    <status :value="item.status"/>
					</div>
					<div class="flex padding-sm text-sm solid-top align-center">
					    <div @click="openQrcode(item.oid)">
                            <m-icon name="qrcode" :size="22"></m-icon>
					    </div>
					    <div class="flex-sub padding-left-sm">余额：{{formatAmount(item.balance)}}元，积分：{{formatNum(item.point)}}</div>
					    <div class="text-blue" @click="openMoneyRecord(item)">明细查询>></div>
					</div>
				</m-card>
			</template>
		</m-list>
		<m-modal ref="qrcode" title="会员扫码查询" :drawer=false>
            <m-card>
                <div class="flex align-center">
                    <div class="padding">
                        <qrcode :path="'/web/member/main.js?oid='+showQrcode" width="100px"></qrcode>
                    </div>
                    <div class="flex-sub">
                        <div class="text-indent">会员扫码可查询会员在商家消费情况。</div>
                        <div class="text-indent">二维码不会改变，可重复扫码或截图保存。</div>
                    </div>
                </div>
            </m-card>
            <div class="flex padding-lr-sm padding-bottom">
                <div class="flex-sub flex flex-direction padding-lr-xs">
                    <m-button @click="closeQrcode()" line>关闭</m-button>
                </div>
            </div>
		</m-modal>
		<m-modal ref="detail" title="会员信息" @close="$refs.list.refresh()">
			<div v-if="showDetail">
				<m-card>
                    <div class="cu-form-group">
                        <div class="title text-red">姓名</div>
                        <m-input :operable="showDetail.operable" v-model="showDetail.realName" placeholder="请输入姓名"></m-input>
                        <m-switch :operable="showDetail.operable" v-model="showDetail.status"></m-switch>
                    </div>
                    <div class="cu-form-group">
                        <div class="title text-red">手机号</div>
                        <m-input v-if="showDetail.operable" v-model="showDetail.phoneNum" placeholder="请输入手机号"></m-input>
                        <div v-else class="flex-sub">{{showDetail.phoneNum}}</div>
                    </div>
                    <div class="cu-form-group">
                        <div class="title text-red">会员级别</div>
                        <m-form-item>
                            <div v-if="showDetail.level.oid" class="flex-sub">{{showDetail.level.name}} {{'优惠'+formatNum(showDetail.level.discount)}}%</div>
                            <div v-else-if="showDetail.operable" class="flex-sub text-placeholder">请选择会员级别</div>
                            <template #action>
                                <m-button @click="selectLevel(showDetail)" size="sm">选择</m-button>
                            </template>
                        </m-form-item>
                    </div>
                    <div class="cu-form-group">
                        <div class="title">备注</div>
                        <m-input type="textarea" :operable="showDetail.operable" v-model="showDetail.remark" placeholder="请输入备注"></m-input>
                    </div>
				</m-card>
                <div v-if="showDetail.operable" class="flex padding-lr-sm padding-bottom">
                    <div class="flex-sub flex flex-direction padding-lr-xs">
                        <m-button @click="closeDetail()" line>关闭</m-button>
                    </div>
                    <div class="flex-sub flex flex-direction padding-lr-xs">
                        <m-button @click="save">保存</m-button>
                    </div>
                </div>
				<m-alert v-else color="orange" join>
				    当前会员由{{showDetail.inputUser.realName}}负责。
				</m-alert>
			</div>
		</m-modal>
    </m-page>
	`,
	props: ['param','parentVue'],
	data:function(){
		return {
            title:'会员列表',
            url:'action/base/memberInfo/getList',
            params:{},
            search:[
                {title:'姓名',name:'realName@like',input:'text'},
                {title:'手机号',name:'phoneNum@like',input:'text'},
                {title:'余额起',name:'balance@ge',input:'number'},
                {title:'余额止',name:'balance@le',input:'number'},
                {title:'积分起',name:'point@ge',input:'number'},
                {title:'积分止',name:'point@le',input:'number'}
            ],
            showDetail:null,
            showQrcode:''
		};
	},
	mounted(){
	},
	methods:{
        openDetail:function(item){
            this.showDetail=Object.assign({},item);
            this.$refs.detail.open();
        },
        closeDetail:function(){
            this.$refs.detail.close();
        },
        selectLevel:function(model){
            let selectOid=model.level?model.level.oid:'';
	        this.openPage('common/selectLevel.js',{title:'选择会员级别',selectOid:selectOid},(flag,obj)=>{
	            if(flag){
	                model.level=obj;
                }
	        });
        },
        save:function(){
            this.requestData('action/base/memberInfo/save',
                {model:this.showDetail},
                (data)=>{
                    if(data.code==0){
                        this.remind().success(data.msg);
                        this.closeDetail();
                    }else{
                        this.remind().error(data.msg);
                    }
                }
            );
        },
        openMoneyRecord:function(model){
	        this.openPage('base/memberMoneyRecordList.js',{realName:model.realName,oid:model.oid},(flag,obj)=>{});
        },
        openQrcode:function(item){
            this.showQrcode=item;
            this.$refs.qrcode.open();
        },
        closeQrcode:function(){
            this.$refs.qrcode.close();
        },
	}
}